<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<div th:fragment="menu">

    <!-- 修改管理员的请求方式为post    enctype="multipart/form-data"-->
    <form method="post" id="updateEquipment"
          enctype="multipart/form-data">
        <!-- 模态框Modal -->
        <div aria-hidden="true" aria-labelledby="myModalLabel" role="dialog"
             tabindex="-1" id="updateEquipmentModal" class="modal fade">
            <!-- 设置请求方式为method     类型 enctype="multipart/form-data"  -->
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"
                                aria-hidden="true">&times;
                        </button>
                        <h3 style="text-align: center">修改器材信息</h3>
                    </div>
                    <div class="modal-body">
                        <input type="hidden" name="id" />
                        <p>器材名称：</p>
                        <input type="text" name="name" placeholder="请输入器材名称"
                               autocomplete="off" class="form-control placeholder-no-fix">
                    </div>
                    <div class="modal-body">
                        <p>器材总个数：</p>
                        <input type="text" name="totalNums" placeholder="请输入器材总个数"
                               autocomplete="off" class="form-control placeholder-no-fix">
                    </div>
                    <div class="modal-body">
                        <p>器材借出个数：</p>
                        <input type="text" name="rentNums" placeholder="请输入器材借出个数"
                               autocomplete="off" class="form-control placeholder-no-fix">
                    </div>
                    <div class="modal-body">
                        <p>器材类别：</p>
                        <input type="text" name="typeName" placeholder="请输入器材类别"
                               autocomplete="off" class="form-control placeholder-no-fix">
                    </div>
                    <div class="modal-body">
                        <p>器材状态：</p>
                        <input type="text" name="statusStr" placeholder="请输入器材状态"
                               autocomplete="off" class="form-control placeholder-no-fix">
                    </div>
                    <div class="modal-footer">
                        <button data-dismiss="modal" class="btn btn-default" type="button">取消</button>
                        <button class="btn btn-theme" type="button" onclick="submitUpdateEquipment();">修改</button>
                    </div>
                </div>
            </div>
        </div>
    </form>
    <!-- 修改管理员的请求方式为post    enctype="multipart/form-data"-->
<!--   处理修改操作 -->
    <script>
        //定义一个函数来处理修改操作
        function submitUpdateEquipment(){
            //1、获取注册表单所需要提交的数据【文本信息-文件信息】
            var data = new FormData(document.getElementById("updateEquipment"));
            console.log(data);
            //2、通过ajax函数提交异步请求
            $.ajax({
                url:'updateEquipment',
                type:'post',
                data: data,
                // dataType:'json',
                //对于文件传输设置的属性键值对
                cache:false,//缓存判断
                processData:false,//
                contentType:false,//
                //3、请求成功之后，根据响应的结果来进行操作处理【修改失败--修改成功】
                success: function (result){
                    console.log("====================================");
                    if(result.isok==true){//修改成功
                        alert("修改成功");
                        location.reload();
                    }else {//修改失败
                        alert(result.message);
                    }
                },
                error: function (){
                    alert("操作失败，程序出现错误！");
                }
            });
        }
    </script>
    <!--   处理修改操作 -->

</div>

</html>